import React, {  useEffect, useState } from 'react'

function useAddListener() {
  useEffect(() => {
    console.log('home, 组件挂载 | 更新');
    return () => {
      console.log('home 卸载');
    }
  })
}

function Home() {
  useAddListener()
  return (
    <div>
      home组件
    </div>
  )
}
function About() {
  return (
    <div>
      about组件
    </div>
  )
}

function App() {
  const [isshowState, setIsShow] = useState(true)
  return (
    <div>
      {isshowState && <Home />}
      <About />
      <button onClick={() => { setIsShow(!isshowState) }}>切换</button>
    </div>

  );
}

export default App;